import React from 'react'
const Input = ({placeHolder,value,changeHandler})=>{
    return (
        <input placeholder={placeHolder} value={value} onChange={changeHandler} className='join_room_input' />
    )
}
const JoinRoomInputs = (props) => {
const {roomIdValue,setRoomIdValue,nameValue,setNameValue,isRoomHost} = props;
const handleRoomIdValueChange = (event) => {
    setRoomIdValue(event.target.value);
};
const handleNameValueChange = (event) => {
    setNameValue(event.target.value);
};
  return (
    <div className='join_room_inputs_container'>
       {!isRoomHost && <Input placeHolder={'请输入会议ID号'}
        value={roomIdValue}
        changeHandler={handleRoomIdValueChange}/>}
         <Input placeHolder={'请输入你的姓名'}
        value={nameValue}
        changeHandler={handleNameValueChange}/>
    </div>
  )
}

export default JoinRoomInputs